<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
    <head>
        <title>Delivery Tracker</title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
        <meta name="description" content="Tu Primer Restaurante Con Rastreo De Delivery" />
        <meta name="keywords" content="jquery, css3, sliding, box, menu, cube, navigation, portfolio, thumbnails"/>
		<link rel="shortcut icon" href="../favicon.ico" type="image/x-icon"/>
        <link rel="stylesheet" href="css/style.css" type="text/css" media="screen"/>
        <style>
			body{
				background:#333 url(bg.jpg) repeat top left;
				font-family:Arial;
			}
			span.reference{
				position:fixed;
				left:10px;
				bottom:10px;
				font-size:12px;
			}
			span.reference a{
				color:#aaa;
				text-transform:uppercase;
				text-decoration:none;
				text-shadow:1px 1px 1px #000;
				margin-right:30px;
			}
			span.reference a:hover{
				color:#ddd;
			}
			ul.sdt_menu{
				margin-top:110px;
			}
			h1.title{
				text-indent:-9000px;
				background:transparent url(titulo.png) no-repeat top left;
				width:633px;
				height:69px;
			}
		</style>
    </head>

    <body>
		<div class="content">
			<h1 class="title">Tu Primer Restaurante Con Rastreo De Delivery</h1>
			<ul id="sdt_menu" class="sdt_menu">
				<li>
					<a href="#">
						<img src="images/2.jpg" alt=""/>
						<span class="sdt_active"></span>
						<span class="sdt_wrap">
							<span class="sdt_link">Home</span>
							<span class="sdt_descr">Bienvenidos</span>
						</span>
					</a>
				</li>
				<li>
					<a href="#">
						<img src="images/1.jpg" alt=""/>
						<span class="sdt_active"></span>
						<span class="sdt_wrap">
							<span class="sdt_link">Mi Cuenta</span>
							<span class="sdt_descr">Todos Mis Datos</span>
						</span>
					</a>
					<div class="sdt_box">
							<a href="#">Login</a>
							<a href="#">Registrarse</a>
							<a href="#">Datos Personales</a>
					</div>
				</li>
				<li>
					<a href="#">
						<img src="images/6.jpg" alt=""/>
						<span class="sdt_active"></span>
						<span class="sdt_wrap">
							<span class="sdt_link">Pedidos</span>
							<span class="sdt_descr">Food Zone</span>
						</span>
					</a>
					<div class="sdt_box">
						<a href="#">Realice Un Pedido</a>
						<a href="#">Vea Historial</a>
					</div>
				</li>
				<li>
					<a href="#">
						<img src="images/3.jpg" alt=""/>
						<span class="sdt_active"></span>
						<span class="sdt_wrap">
							<span class="sdt_link">Promos</span>
							<span class="sdt_descr">No te lo pierdas</span>
						</span>
					</a>
				</li>
				<li>
					<a href="#">
						<img src="images/5.jpg" alt=""/>
						<span class="sdt_active"></span>
						<span class="sdt_wrap">
							<span class="sdt_link">Prueba</span>
							<span class="sdt_descr">Prueba</span>
						</span>
					</a>
				</li>
				<li>
					<a href="#">
						<img src="images/4.jpg" alt=""/>
						<span class="sdt_active"></span>
						<span class="sdt_wrap">
							<span class="sdt_link">Acerca De</span>
							<span class="sdt_descr">Contactenos</span>
						</span>
					</a>
				</li>
			</ul>
		</div>
		
        <!-- The JavaScript -->
        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
		<script type="text/javascript" src="jquery.easing.1.3.js"></script>
        <script type="text/javascript">
            $(function() {
				/**
				* for each menu element, on mouseenter, 
				* we enlarge the image, and show both sdt_active span and 
				* sdt_wrap span. If the element has a sub menu (sdt_box),
				* then we slide it - if the element is the last one in the menu
				* we slide it to the left, otherwise to the right
				*/
                $('#sdt_menu > li').bind('mouseenter',function(){
					var $elem = $(this);
					$elem.find('img')
						 .stop(true)
						 .animate({
							'width':'170px',
							'height':'170px',
							'left':'0px'
						 },400,'easeOutBack')
						 .andSelf()
						 .find('.sdt_wrap')
					     .stop(true)
						 .animate({'top':'140px'},500,'easeOutBack')
						 .andSelf()
						 .find('.sdt_active')
					     .stop(true)
						 .animate({'height':'170px'},300,function(){
						var $sub_menu = $elem.find('.sdt_box');
						if($sub_menu.length){
							var left = '170px';
							if($elem.parent().children().length == $elem.index()+1)
								left = '-170px';
							$sub_menu.show().animate({'left':left},200);
						}	
					});
				}).bind('mouseleave',function(){
					var $elem = $(this);
					var $sub_menu = $elem.find('.sdt_box');
					if($sub_menu.length)
						$sub_menu.hide().css('left','0px');
					
					$elem.find('.sdt_active')
						 .stop(true)
						 .animate({'height':'0px'},300)
						 .andSelf().find('img')
						 .stop(true)
						 .animate({
							'width':'0px',
							'height':'0px',
							'left':'85px'},400)
						 .andSelf()
						 .find('.sdt_wrap')
						 .stop(true)
						 .animate({'top':'25px'},500);
				});
            });
        </script>
		
		<div id="center">
		  <h1>Bienvenidos a Tu Restaurante Online!</h1>
			  <div class="body_text">
		  Order your pizza today from the Pizza Zone and it will be delivered at your door step. Jump in to our weekly special deals in the Special Deals menu. Register an account with us to enjoy fast ordering, delevery, and convenient payment of your pizza. Check out our variety of pizza from our pizza galery below:
		  </div>
		 </div>
		<object width="771" height="200" align ="center" 
		  type="application/x-shockwave-flash"
		  data="swf/Carousel.swf">
		  <param name="movie" value="swf/Carousel.swf" />
		  <param name="bgcolor" value="#bd6f2f" />
		  <param name="flashvars" value="xmlfile=default.xml&loaderColor=0x666666" />
		</object>
		<div id="footer">
			<div class="bottom_menu"><a href="home.htm">Home Page</a>  |  <a href="aboutus.htm">About Us</a>  |  <a href="specialdeals.php">Special Deals</a>  |  <a href="pizzazone.php">Pizza Zone</a>  |  <a href="#">Affiliate Program</a> |<br>
		  | <a href="admin/index.php" target="_blank">Administrator</a> |</div>
		  
		  <div class="bottom_addr">&copy; 2012 Pizza-Inn. All Rights Reserved</div>
		</div>
		</div>
    </body>
</html>